<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page import="com.are.odisea.*"%>
<%@include file="../validausuario.jsp"%>
<html>
<head>
<meta charset="utf-8">
	<title>Odisea - Documentos</title>
	<link rel="stylesheet" href="../themes/redmond/jquery.ui.all.css">
	<LINK REL="stylesheet" TYPE="text/css" HREF="../main.css">
	<script src="../ui/jquery-1.8.0.js" language="JavaScript"></script>
	<script src="../ui/jquery.ui.core.js" language="JavaScript"></script>
	<script src="../ui/jquery.ui.widget.js" language="JavaScript"></script>
	<script src="../ui/jquery.ui.tabs.js" language="JavaScript"></script>
	<script src="../ui/jquery.ui.button.js"></script>
	<script src="../ui/jquery.effects.core.js"></script>
	<script src="../ui/jquery.effects.slide.js"></script>
	<script src="../ui/jquery.ui.datepicker.js"></script>
	<script src="../ui/jquery.effects.explode.js"></script>
	<script src="../ui/jquery.effects.fold.js"></script>
	<script src="../ui/jquery.effects.slide.js"></script>
	<script src="../ui/jquery.ui.draggable.js"></script>
	<script src="../ui/jquery.ui.position.js"></script>
	<script src="../ui/jquery.ui.resizable.js"></script>
	<script src="../ui/jquery.ui.dialog.js"></script>
	<script src="../ui/jquery.effects.core.js"></script>
	<script src="../ui/jquery.ui.widget.js"></script>
	<script src="../ui/jquery.ui.mouse.js"></script>
	<script src="../ui/jquery.bgiframe-2.1.2.js"></script>
	<style>
		body {  }
		label, input { display:block; }
		input.text { margin-bottom:12px; width:95%; padding: .4em; }
		fieldset { padding:0; border:0; margin-top:25px; }
		h1 { font-size: 1.2em; margin: .6em 0; }
		div#users-contain { width: 350px; margin: 20px 0; }
		div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
		div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
		.ui-dialog .ui-state-error { padding: .3em; }
		.validateTips { border: 1px solid transparent; padding: 0.3em; }
	</style>
	<script>
	$(function() {
		//callback function to bring a hidden box back
		function callback() {
			/*setTimeout(function() {
				$( "#effect:visible" ).removeAttr( "style" ).fadeOut();
			}, 1000 );*/
		};

		// set effect from select menu value
		$( "#cmdNuevo" ).click(function() {
			runEffect();
			return false;
		});
		
		$( "#cmd_Cancel" ).click(function() {
			hideEffect();
			return false;
		});
		
		$( "#tabs" ).tabs();
		$( "input:submit, a, button", ".demo" ).button();
		$( "input:button, a, button", ".demo" ).button();
		//$( "a", ".demo" ).click(function() { return false; });
		$( "#fecha" ).datepicker({
			showOn: "button",
			buttonImage: "images/calendar.gif",
			buttonImageOnly: true
		});
		$( "#fecha" ).datepicker( "option", "showAnim", "slide" );
		
	/*$("#cmd_Nuevo").click(function(){ 
			$("#detalle").remove(); // ELIMINA EL ELEMENTO CON id = "detalle"
			$(".Formulario").show("blind", { direction: "horizontal" }, 1000);
			$(".NuevoCmd").hide("blind", { direction: "horizontal" }, 1000);
			return false;		
		});*/
		
		/*$("#cmd_Cancel").click(function(){
				$(".Formulario").hide("blind", { direction: "horizontal" }, 1000);
				$(".NuevoCmd").show("blind", { direction: "horizontal" }, 1000);
				$("#detalle").remove();
				return false;		
			});*/
			
	//------------------------------------------- FUNCIONES PARA EL MODAL POPUP -------------------------------------------------------------------
	
$( "#dialog:ui-dialog" ).dialog( "destroy" );
		
		var name = $( "#name" ),
			email = $( "#email" ),
			password = $( "#password" ),
			allFields = $( [] ).add( name ).add( email ).add( password ),
			tips = $( ".validateTips" );

		function updateTips( t ) {
			tips
				.text( t )
				.addClass( "ui-state-highlight" );
			setTimeout(function() {
				tips.removeClass( "ui-state-highlight", 1500 );
			}, 500 );
		}

		function checkLength( o, n, min, max ) {
			//if ( o.val().length > max || o.val().length < min ) {
				o.addClass( "ui-state-error" );
				updateTips(n);
				//return false;
			//} else {
				return true;
			//}
		}

		function checkRegexp( o, regexp, n ) {
			if ( !( regexp.test( o.val() ) ) ) {
				o.addClass( "ui-state-error" );
				updateTips( n );
				return false;
			} else {
				return true;
			}
		}
		
		$( "#dialog-form" ).dialog({
			autoOpen: false,
			height: 300,
			width: 350,
			modal: true,
			buttons: {
				"Asignar Permiso": function() {
					var bValid = true;
					allFields.removeClass( "ui-state-error" );
					//bValid = bValid && checkLength( email, "email", 6, 80 );
					//bValid = bValid && checkLength( password, "password", 5, 16 );
					//bValid = bValid && checkRegexp( name, /^[a-z]([0-9a-z_])+$/i, "Username may consist of a-z, 0-9, underscores, begin with a letter." );
					// From jquery.validate.js (by joern), contributed by Scott Gonzalez: http://projects.scottsplayground.com/email_address_validation/
					//bValid = bValid && checkRegexp( email, /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "eg. ui@jquery.com" );
					//bValid = bValid && checkRegexp( password, /^([0-9a-zA-Z])+$/, "Password field only allow : a-z 0-9" );
					if ( bValid ) {
						var iddoc=$("#name").val();
						var usuario=$("#email").val();
						
						$.post(
								"SrvAsigPermiso", {
									usuario : usuario,
									iddoc: iddoc
								},
								procesar
							);
						//bValid = bValid && checkLength( email, resultado, 6, 80 );
						//$( this ).dialog( "close" );
					}
				},
				Cerrar: function() {
					$( this ).dialog( "close" );
				}
			},
			close: function() {
				allFields.val( "" ).removeClass( "ui-state-error" );
			}
		});

		$( "#create-user" )
			.button()
			.click(function() {
				$( "#dialog-form" ).dialog( "open" );
			});
		$( "a.basic" )
		.click(function() {
			$("#name").attr('value', $(this).data('gid'));
			$('#name').attr('disabled','-1')
			$( "#dialog-form" ).dialog( "open" );
		});
	});
	function procesar(resultado) {
		bValid = bValid && checkLength( email, resultado, 6, 80 );
	}
	</script>
</head>
<body>
<%@include file="../headerMan.jsp"%>
<div class="contencenter demo">
<H2><img src="../images/documentos.png" />Documentos</H2>
<a href="Categorias.jsp?nivel=1&parent=0">Categorias</a>
<div id="tabs">
	<ul>
		<li><a href="#tabs-2">Mis Documentos</a></li>
		<li><a href="#tabs-3">Crear Nuevo Documento</a></li>
	</ul>
	<div id="tabs-2">
		<%HttpSession ses=request.getSession(); %>
    	<%HtmlDocumentos doc=new HtmlDocumentos();%>
		<%out.print(doc.TablaMisDocumentos((String)ses.getAttribute("id_usuario")));%>
	</div>
	<div id="tabs-3">
		<div id="CrearUsuario" style= "width: 100%; <!-- display:none; -->" class="Formulario" >

</div>	
<!-- ------------------------------------------------------------------------------------------------------------------------------ -->
<div class="toggler">
	<div id="effect" class="ui-widget-content ui-corner-all">
		<h3 class="ui-widget-header ui-corner-all" style="text-align:center;">Registro de Documento</h3>
		<p>
			<form name="form1" id="form1" method="post" enctype='multipart/form-data' action="../SrvDocumentos">
<table style="width: 100%;">
            <tr>
                <td>
                    Categoria</td>
                <td>
                <%HtmlCategorias cat=new HtmlCategorias(); %>
                    <select id="Categorias" name="Categorias">
                    <%out.print(cat.LlenarCombo(1)); %>
                    </select></td>
            </tr>
            <tr>
                <td>
                    Descripci&oacute;n</td>
                <td>
                    <textarea name="Descripcion" id="Descripcion" rows="5" cols="40" class="text ui-widget-content ui-corner-all"></textarea></td>
            </tr>
            <tr>
                <td>Fecha de Publicaci&oacute;n</td>
                <td><input type="text" class="date-pick ui-widget-content ui-corner-all" id="fecha" name="fecha" value="" size="10" /></td>
            </tr>
            <tr>
                <td>
                    Archivo</td>
                <td>
                    <input id="documento" name="documento" type="file" /></td>
            </tr>
            <tr>
				<td colspan=2>
				<div id="MsgResult"></div>
				<div id="Titulo" style="width: 100%; text-align:center;">
				<input type="submit" name="cmd_agregar" id="cmd_agregar" value = "Agregar Documento">
				<input type="button" name="cmd_Cancel" id="cmd_Cancel" value="Cancelar">
				</div>
				</td>
			</tr>
        </table>
</form>
	</div>
</div>
	</div>
</div>
</div><!-- End demo -->

<!-- --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- -->
<%@include file="../foot.jsp"%>
</body>
</html>